﻿function NewUserWindow() {
    //Adding event listeners
    var _addHandlers = function () {
        //событие кнопок назад
        $('.nextButton').click(function() {
            validate(true);//проверка достоверности
            $('#windowsSection').jqxTabs('next');//переход далее будет осуществлен, если валидация успешная
        });
        //событие кнопок вперед
        $('.backButton').click(function() {
            validate(true);//валидация
            $('#windowsSection').jqxTabs('previous');//переход на вкладку назад
        });
        //событие выбора роли
        $('#roleInput').bind('change', function() {
            $('#form').jqxValidator('validateInput', '#roleInput');//валидация роли
        });
        //подготовка итоговой модели
        $('#windowsSection').on('selecting', function(event) {
            var pageIndex = event.args.item + 1;//определяем номер вкладки
            if (pageIndex == 3) {//если вкладка последняя(сохранение)
                //переопределение параметров
                model.Login = $('#usernameInput').val();
                model.Password = $('#passwordInput').val();
                model.UserName = $('#nameInput').val();
                model.Family = $('#familyInput').val();
                model.Role = $("#roleInput").jqxDropDownList('getSelectedItem').value;
                model.ListOfCar = new Array();
                var carList = $('#userCarList').jqxListBox('getItems');
                for (var key in carList) {
                    model.ListOfCar.push(carList[key].value);
                }
                //вывод значений в сводную страничку
                $('#Login').text(model.Login);
                $('#Password').text(model.Password);
                $('#UserName').text(model.UserName);
                $('#Family').text(model.Family);
                $('#Role').text($("#roleInput").jqxDropDownList('getSelectedItem').label);
                $('#Diler').text($("#dilerIdInput").val());
                $('#CarCount').text(model.ListOfCar.length);
            }
        });
        //сохранение в базу
        $('#saveUserButton').click(function() {
            $.ajax({
                url: "/data/user",
                dataType: "json",
                data: JSON.stringify(model),//данные
                type: 'PUT',
                contentType: 'application/json; charset=UTF-8'
            }).done(function(data) {//запрос выполнен успешно
                if (data != null) {
                    alert(data,"Внимание");//сервер что-то вернул
                } else {
                    $('#addUserWindow').jqxWindow('close');//закрываем окно
                    $('#userGrid').jqxGrid('updatebounddata');//обновляем таблицу
                }
            }).error(function () {//ошибка в передаче данных
                alert("Ошибка связи с сервером.");
            });
        });
        //фильтр машин
        $('#carFilter').keyup(function() {
            $.ajax({
                url: "/data/detailscar",
                dataType: "json",
                data: { name: this.value },
                type: 'GET',
                cache: true,
                contentType: 'application/json; charset=UTF-8'
            }).done(function(data) {
                if (data.length > 0) {
                    //функция преобразования в node tree
                    for (var key in data) {
                        var curElem = data[key];
                        curElem.Name = '<img class=\'' + curElem.Class + '\' /><span>' + curElem.Name + '</span>';
                    }
                    //инициализация массива
                    var source = {
                        datatype: 'array',
                        datafields: [
                            { name: 'Id' },
                            { name: 'ParentId' },
                            { name: 'Name' }
                        ],
                        id: 'Id',
                        localdata: data
                    };
                    // create data adapter.
                    var carDataAdapter = new $.jqx.dataAdapter(source);
                    // perform Data Binding.
                    carDataAdapter.dataBind();
                    var carRecords = carDataAdapter.getRecordsHierarchy('Id', 'ParentId', 'items', [{ name: 'Name', map: 'label' }, { name: 'Id', map: 'id' }]);
                    //биндинг
                    $('#avaibleCarTree').jqxTree({ source: carRecords });
                    $('#avaibleCarTree').jqxTree('refresh');
                    //инициализация DragAndDrop
                    initCarsDragAndDrop();

                } else {
                    $('#avaibleCarTree').jqxTree('clear');//очистить дерево если пришел пустой список
                }
            }).error(function () {
                alert('С сервером связь отсутствует');
            });
        });
        //удаление из списка доступной машины
        $("#deleteMenu").bind('itemclick', function() {
            var element = $("#userCarList").jqxListBox('getSelectedItem');//получение элемента, по которому был произведен щелчек
            $("#userCarList").jqxListBox('removeAt', element.index);//удаление элемента
            validate(true);//валидация
        });
        // open the context menu when the user presses the mouse right button.
        $("#userCarList").bind('mousedown', function(event) {
            var rightClick = isRightClick(event);//получение статуса на правый щелчек
            if (rightClick) {//если правый щелчек
                if (event.target.nodeName == "SPAN") {//если сделан по строчке, то открыть мению
                    var scrollTop = $(window).scrollTop();
                    var scrollLeft = $(window).scrollLeft();
                    $("#deleteMenu").jqxMenu('open', parseInt(event.clientX) + 5 + scrollLeft, parseInt(event.clientY) + 5 + scrollTop);
                } else {//закрыть меню
                    $("#deleteMenu").jqxMenu('close');
                }
                return false;//отмена стандартного щелчка
            }
            return true;//продолжить обработку щелчка
        });
        // disable the default browser's context menu.
        $('#userCarList').bind('contextmenu', function() {
            return false;
        });
        function isRightClick(event) {
            var rightclick;
            if (!event) var event = window.event;
            if (event.which) rightclick = (event.which == 3);
            else if (event.button) rightclick = (event.button == 2);
            return rightclick;
        }
        //инициализация окна при открытии
        $('#addUserWindow').bind('open', function () {
            //проверка, что окно открылось и первый раз, все последующие перезагрузки окна
            //будут блокироваться
            if (firsLoad) {
                firsLoad = false;
                //если создаем нового пользователя
                if (model.IsNewUser) {
                    //блокируем вкладки
                    $('#windowsSection').jqxTabs('disableAt', 1);
                    $('#windowsSection').jqxTabs('disableAt', 2);
                    //очищаем логин пользователя
                    $('#usernameInput').val("");
                    $('#usernameInput').jqxInput({ disabled: false });
                    //очищаем поле пароля
                    $('#passwordInput').val("");
                    $('#passwordInput').jqxInput({ disabled: false });
                    //очищаем поле имени
                    $('#nameInput').val("");
                    //очищаем поле фамилии
                    $('#familyInput').val("");
                    //убираем выделение дилера
                    model.DilerId = 0;
                    $('#dilerIdInput').val("");
                    //присваеваем название окну
                    $('#addUserWindow').jqxWindow({ title: 'Регистрация нового пользователя' });
                    //снимаем выделение роли
                    $("#roleInput").jqxDropDownList('clearSelection');
                    $("#userCarList").jqxListBox('clear');
                } else { //редактирование уже существующего пользователя из модели
                    //присваиваем значение логина и блокируем его
                    $('#usernameInput').val(model.Login);
                    $('#usernameInput').jqxInput({ disabled: true });
                    //присваиваем заначение пороля и блокируем его
                    $('#passwordInput').val('');
                    $('#passwordInput').jqxInput({ disabled: true });
                    //вставляем значение имени пользователя
                    $('#nameInput').val(model.Name);
                    //вставляем значение фамилии пользователя
                    $('#familyInput').val(model.Family);
                    //вставляем значение дилера
                    model.DilerId = model.Service.Id;
                    $('#dilerIdInput').val(model.Service.Name);
                    //выбираем роль из списка
                    var item = $("#roleInput").jqxDropDownList('getItemByValue', model.Role);
                    if (item != null) {
                        $("#roleInput").jqxDropDownList('selectItem', item);
                    }
                    //изменяем название окна
                    $('#addUserWindow').jqxWindow({ title: 'Изменение параметров пользователя' });

                    //добавление в список доступных машин

                    for (var key in model.CarList) {
                        var curElem = model.CarList[key];
                        curElem.Name = '<img class=\'' + curElem.Comment + '\' /><span>' + curElem.Name + '</span>';
                    }
                    var source =
                        {
                            datatype: "array",
                            localdata: model.CarList
                        };
                    // create a new instance of the jqx.dataAdapter.
                    var dataAdapter = new $.jqx.dataAdapter(source);
                    // Create a userCarList
                    $("#userCarList").jqxListBox({
                        source: dataAdapter,
                        displayMember: "Name",
                        valueMember: "Id"
                    });
                }
            }
        });
        //событие закрытия окна
        $('#addUserWindow').bind('close', function () {
            //уведомляем, что последующее открытие будет первым
            firsLoad = true;
        });

    };
    //процедура инициализации возможности DragAndDrop
    var initCarsDragAndDrop = function () {
        //подключаем плагин DragAndDrop
            $('.draggable').jqxDragDrop({
                dropTarget: $('#userCarList'), revert: true
            });
        //события входа
            $('.draggable').bind('dropTargetEnter', function () {
                enableInsert = true;
            });
        //событие выхода
            $('.draggable').bind('dropTargetLeave', function () {
                enableInsert = false;
            });
        //биндим событие отпускания объекта
            $('.draggable').bind('dragEnd', function () {
                var item = $('#avaibleCarTree').jqxTree('getItem', this.parentElement);//элемент, который перетаскивается
                if (enableInsert && item.id.indexOf('tree_') == -1) {//если не узел
                    var unic = true;//по умолчанию уникальныей
                    var itemsFromList = $("#userCarList").jqxListBox('getItems');//получаем список всех элементов
                    for (var key in itemsFromList) {//пройти по всем элементам (элемент по значению не срабатывает)
                        if (itemsFromList[key].value == item.id) {//если запись с таким id уже есть, то
                            unic = false;//помечаем как неуникальную
                            break;//отмена обхода цикла
                        }
                    }
                    if (unic) {//если записи в списке нету, то добавляем в лист
                        $("#userCarList").jqxListBox('addItem', {
                            label: item.label,
                            value: item.id
                        });
                    }
                }

            });
    };
    
    //Validating all wizard tabs
    function validate(notify) {
        if (!firstTab(notify)) {//если есть ошибки на первой вкладке
            $('#windowsSection').jqxTabs('disableAt', 1);
            $('#windowsSection').jqxTabs('disableAt', 2);
            return;
        } else {//иначе разрешаем доступ ко второй
            $('#windowsSection').jqxTabs('enableAt', 1);
        }
        if (!secondTab(notify)) {//если есть ошибки на второй вкладке
            $('#windowsSection').jqxTabs('disableAt', 2);
            return;
        } else {//разрешаем доступ к сохранению
            $('#windowsSection').jqxTabs('enableAt', 2);
        }
    }
    //Displaying message to the user
    function showHint(message, selector) {
        if (typeof selector == 'undefined') {//определение селектора по умолчанию
            selector = '.hint';
        }
        if (message == '') {
            message = 'Вы можете продолжить.';
        }
        $(selector).html('<strong>' + message + '</strong>');
    }
    //Validating the first tab
    function firstTab() {
        $('#form').jqxValidator('validate');
        return panelValid.first;
    }
    //Validating the second tab
    function secondTab() {
        var items = $('#userCarList').jqxListBox('getItems');
        if (undefined == items || items.length == 0) {
            showHint('У пользователя нет доступа к машинам.', '#hintBasket');
            return false;
        } else {
            showHint('Вы можете продолжить', '#hintBasket');
            return true;
        }
    }
    //процедура инициализации элементов
    function initElememt() {
        //основное окно
        $('#addUserWindow').jqxWindow({
            resizable: false,
            autoOpen: false,
            height: 440,
            width: 611,
            theme: theme
        });
        //инициализация панелей
        $('#windowsSection').jqxTabs({ height: 400, width: 600, theme: theme, keyboardNavigation: false });
        //поле ввода логина
        $("#usernameInput").jqxInput({
            placeHolder: "Логин",
            height: 25,
            width: '100%',
            theme: theme
        });
        //поле ввода пароля
        $("#passwordInput").jqxInput({
            placeHolder: "Пароль",
            height: 25,
            width: '100%',
            theme: theme
        });
        //поле ввода имени пользователя
        $("#nameInput").jqxInput({
            placeHolder: "Имя",
            height: 25,
            width: '100%',
            theme: theme
        });
        //поле ввода фамилии пользователя
        $("#familyInput").jqxInput({
            placeHolder: "Фамилия",
            height: 25,
            width: '100%',
            theme: theme
        });
        //конпки Вперед и Назад
        $('#nextButtonInfo').jqxButton({ width: 50, theme: theme });
        $('#nextButtonBasket').jqxButton({ width: 50, theme: theme });
        $('#backButtonBasket').jqxButton({ width: 50, theme: theme });
        $('#backButtonReview').jqxButton({ width: 50, theme: theme });
        $('#saveUserButton').jqxButton({ width: 80, theme: theme });
        //создание панели на второй вкладке
        $("#treeSelecterPanel > div").css({ width: '298px', height: 'auto' });
        $("#treeSelecterPanel").jqxDockPanel({ width: '596', height: '300', theme: theme });
        //список машин пользователя (нового или редактируемого)
        $("#userCarList").jqxListBox({
            allowDrag: false,
            multiple: false,
            width: '294',
            height: '99%',
            theme: theme
        });
        //поле фильтра машин
        $("#carFilter").jqxInput({
            placeHolder: "Название машины",
            height: 25,
            width: '99%',
            minLength: 1,
            theme: theme
        });
        //контексное меню удаление машины
        $("#deleteMenu").jqxMenu({
            width: '80px',
            height: '31px',
            autoOpenPopup: false,
            mode: 'popup',
            theme: theme
        });
        //выпадающий список доступных ролей
        $("#roleInput").jqxDropDownList({
            source: [
                { name: "Наладчик", role: "worker" },
                { name: "Сервисный центр", role: "service" },
                { name: "Администратор", role: "admin" }],
            width: '100%',
            height: '25',
            theme: theme,
            autoDropDownHeight: true,
            promptText: 'Права доступа',
            displayMember: 'name',
            valueMember: 'role'
        });
        //поле выбора диллера
        $("#dilerIdInput").jqxInput({
            placeHolder: "Дилерская организация",
            height: 25,
            width: '100%',
            theme: theme,
            source: function (query, response) {
                var dataAdapter = new $.jqx.dataAdapter(
                    {
                        datatype: "json",
                        datafields:
                            [
                                { name: 'label' },
                                { name: 'id' }
                            ],
                        url: "/data/Classificator"
                    },
                    {
                        contentType: 'application/json; charset=UTF-8',
                        autoBind: true,
                        formatData: function (data) {
                            data.id = 10010000000;
                            data.name_startsWith = query;
                            return data;
                        },
                        loadComplete: function (data) {
                            if (data.length > 0) {
                                response($.map(data, function (item) {
                                    return {
                                        label: item.label,
                                        value: JSON.stringify(item)
                                    };
                                }));
                            }
                        }
                    }
                );
            },
            renderer: function (itemValue) {
                itemValue = JSON.parse(itemValue);
                model.DilerId = itemValue.id;
                $('#form').jqxValidator('validateInput', '#dilerIdInput');
                return itemValue.label;
            }
        });
        //модуль валидации первой вкладки
        $('#form').jqxValidator({
            rules: [
                { input: '#usernameInput', message: 'Необходимо ввести логин!', action: 'keyup, blur', rule: 'required' },
                { input: '#usernameInput', message: 'Длина логина должна быть от 6 до 20 символов!', action: 'keyup, blur', rule: 'length=6,20' },
                {
                    input: '#passwordInput', message: 'Длина пароля должна быть от 6 до 60 символов!', action: 'keyup, blur',
                    rule: function (input) {
                        var value = $(input.selector).val();
                        if ((!model.IsNewUser)&&( value== "")){//для редактируемого пользователя пароль м.б. пустым
                            return true;
                        }
                        return (value.length > 5 && value.length<61);
                    }
                },
                { input: '#nameInput', message: 'Необходимо ввести реальное имя пользователя!', action: 'keyup, blur', rule: 'required' },
                { input: '#nameInput', message: 'Длина имени должна быть от 3 до 60 символов!', action: 'keyup', rule: 'length=3,60' },
                { input: '#familyInput', message: 'Необходимо ввести фамилию пользователя!', action: 'keyup, blur', rule: 'required' },
                { input: '#familyInput', message: 'Длина фамилии должна быть от 3 до 60 символов!', action: 'keyup', rule: 'length=3,60' },
                {
                    input: '#dilerIdInput',
                    message: 'Необходимо выбрать дилера!',
                    action: 'keyup, blur',
                    rule: function () {
                        if (model.DilerId != 0) {
                            return true;
                        }
                        return false;
                    }
                },
                {
                    input: '#roleInput',
                    message: 'Выберите роль пользователя в системе!',
                    action: 'click',
                    rule: function () {
                        var roleInput = $("#roleInput").jqxDropDownList('getSelectedItem');
                        if (roleInput != null) {//если роль выбрана
                            return true;
                        }
                        return false;
                    }
                }],
            onError: function () {//если не прошло валидацию
                panelValid.first = false;
            },
            onSuccess: function () {//если прошло валидацию
                panelValid.first = true;
            }
        });
    }

    //first load indefin
    var firsLoad = true;
    //переменные достоверности панелей
    var panelValid = {
        first: false,
        second: false
    };
    //итоговая модель
    var model = {
        IsNewUser:true,//поле режима панели
        Login: '',//логин
        Password: '',//пароль
        UserName: '',//имя пользователя
        Family: '',//фамилия
        DilerId: 0,//индификатор диллера
        Role: '',//роль
        ListOfCar: new Array()//список доступных машин
    };
    var enableInsert;
    
    //возвращаемые функции
    return {
        //процедура назначения модели
        SetModel: function(data) {
            model = data;
        },
        //процедура инициализации
        Init: function() {
            initElememt();//инициализация элементов
            //получение дерева доступных машин
            $.ajax({
                url: "/data/detailscar",
                dataType: "json",
                type: 'GET',
                contentType: 'application/json; charset=UTF-8'
            }).done(function (data) {
                for (var key in data) {
                    var curElem = data[key];
                    curElem.Name = '<img class=\'' + curElem.Class + '\' /><span>' + curElem.Name + '</span>';
                }
                var source = {
                    datatype: 'array',
                    datafields: [
                        { name: 'Id' },
                        { name: 'ParentId' },
                        { name: 'Name' }
                    ],
                    id: 'Id',
                    localdata: data
                };
                // create data adapter.
                var carDataAdapter = new $.jqx.dataAdapter(source);
                // perform Data Binding.
                carDataAdapter.dataBind();
                var carRecords = carDataAdapter.getRecordsHierarchy('Id', 'ParentId', 'items', [{ name: 'Name', map: 'label' }, { name: 'Id', map: 'id' }]);
                //инициализация дерева
                $('#avaibleCarTree').jqxTree({
                    source: carRecords,
                    width: 297,
                    height: 268,
                    hasThreeStates: true,
                    allowDrop: false,
                    theme: theme
                });
                initCarsDragAndDrop();
            })
                .error(function () {
                    alert('Ошибка подключения к серверу');
                });
            _addHandlers();//добавление обработчиков событий
            validate();//валидация
        },
        //процедура открытия окна
        ShowDialog: function (isNewUser) {
            model.IsNewUser = isNewUser == true;
            $('#addUserWindow').jqxWindow('open');
        }
    };
};
